<?php
/**
 *
 *
 * CakePHP(tm) : Rapid Development Framework (http://cakephp.org)
 * Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)
 *
 * Licensed under The MIT License
 * For full copyright and license information, please see the LICENSE.txt
 * Redistributions of files must retain the above copyright notice.
 *
 * @copyright     Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)
 * @link          http://cakephp.org CakePHP(tm) Project
 * @package       app.View.Errors
 * @since         CakePHP(tm) v 0.10.0.1076
 * @license       http://www.opensource.org/licenses/mit-license.php MIT License
 */
?>
<div class="content">
		<div class="cgMenu Box" style = 'padding:40px;text-align:center'>
			<div class="page404">
				<br/>
				<h1>亲，你要找的页面不见了</h1>
				<br/><br/>
				<br/><br/><br/><br/><br/><br/>
				<h1 style = 'font-size:100px;color:orange'>404</h1>
				<br/><br/><br/><br/><br/><br/>
				<br/>
				<?php printf(
					__d('cake', '您要查看的网址<br/> %s <br/>不存在.'),
					"<strong>'{$url}'</strong>"
				); ?>
			</div>
			<?php
			if (Configure::read('debug') > 0):
				echo $this->element('exception_stack_trace');
			endif;
			?>
	</div>
</div>
<script type="text/javascript">
<!--
$(function(){
	$('.page404').addClass('once');
	setTimeout(function(){
		$('.page404').removeClass('once');
	},1000);
	$('.page404').hover(function(){
		$(this).addClass('wiggle');
	},function(){
		$(this).removeClass('wiggle');
	});
})
//-->
</script>
<style>
.page404 h1{
	font-size:25px;
	text-align:center;
	color:#0AA733;
}
/*选择器默认样式*/
.page404 {
width:300px;
height:400px;	
box-shadow: 0 1px 3px 1px #ccc;
font-size:14px;
padding:10px;
margin: 0 auto;	
background:#fff;
position: relative;
display:block;
text-align: center;
cursor: pointer;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: ease;
-webkit-animation-fill-mode: both;
-moz-animation-duration: 1s;
-moz-animation-timing-function: ease;
-moz-animation-fill-mode: both;
-ms-animation-duration: 1s;
-ms-animation-timing-function: ease;
-ms-animation-fill-mode: both;
animation-duration: 1s;
animation-timing-function: ease;
animation-fill-mode: both;
}

/*鼠标hover样式*/
@-webkit-keyframes wiggle { 
  0% { -webkit-transform: skewX(9deg); }
  10% { -webkit-transform: skewX(-8deg); }
  20% { -webkit-transform: skewX(7deg); }
  30% { -webkit-transform: skewX(-6deg); }
  40% { -webkit-transform: skewX(5deg); }
  50% { -webkit-transform: skewX(-4deg); }
  60% { -webkit-transform: skewX(3deg); }
  70% { -webkit-transform: skewX(-2deg); }
  80% { -webkit-transform: skewX(1deg); }
  90% { -webkit-transform: skewX(0deg); }
  100% { -webkit-transform: skewX(0deg); }
}
@-moz-keyframes wiggle { 
  0% { -moz-transform: skewX(9deg); }
  10% { -moz-transform: skewX(-8deg); }
  20% { -moz-transform: skewX(7deg); }
  30% { -moz-transform: skewX(-6deg); }
  40% { -moz-transform: skewX(5deg); }
  50% { -moz-transform: skewX(-4deg); }
  60% { -moz-transform: skewX(3deg); }
  70% { -moz-transform: skewX(-2deg); }
  80% { -moz-transform: skewX(1deg); }
  90% { -moz-transform: skewX(0deg); }
  100% { -moz-transform: skewX(0deg); }
}
@-o-keyframes wiggle { 
  0% { -o-transform: skewX(9deg); }
  10% { -o-transform: skewX(-8deg); }
  20% { -o-transform: skewX(7deg); }
  30% { -o-transform: skewX(-6deg); }
  40% { -o-transform: skewX(5deg); }
  50% { -o-transform: skewX(-4deg); }
  60% { -o-transform: skewX(3deg); }
  70% { -o-transform: skewX(-2deg); }
  80% { -o-transform: skewX(1deg); }
  90% { -o-transform: skewX(0deg); }
  100% { -o-transform: skewX(0deg); }
}
@keyframes wiggle { 
  0% { transform: skewX(9deg); }
  10% { transform: skewX(-8deg); }
  20% { transform: skewX(7deg); }
  30% { transform: skewX(-6deg); }
  40% { transform: skewX(5deg); }
  50% { transform: skewX(-4deg); }
  60% { transform: skewX(3deg); }
  70% { transform: skewX(-2deg); }
  80% { transform: skewX(1deg); }
  90% { transform: skewX(0deg); }
  100% { transform: skewX(0deg); }
}
.wiggle,.once{
-webkit-animation-name:wiggle;
-moz-animation-name:wiggle;
-o-animation-name:wiggle;
animation-name:wiggle;
}
</style>
